<template>
  <div>
    <el-container>
      <el-header>
        <h1>用户</h1>
      </el-header>
      <el-container>
        <el-aside width="200px">
          <el-menu
              default-active="2"
              class="el-menu-vertical-demo"
              @open="handleOpen"
              @close="handleClose">
            <template slot="title">
            </template>
            <el-tree :data="menus" :props="defaultProps" @node-click="ruoyiById"></el-tree>
          </el-menu>
        </el-aside>
        <el-main>
          <h1>列表</h1>
          <el-table
              :data="tableData"
              style="width: 100%">
            <el-table-column
                prop="id"
                label="用户编号"
                width="180">
            </el-table-column>
            <el-table-column
                prop="username"
                label="用户名称"
                width="180">
            </el-table-column>
            <el-table-column
                prop="nickName"
                label="用户昵称">
            </el-table-column>
            <el-table-column
                prop="tel"
                label="电话">
            </el-table-column>
            <el-table-column
                prop="status"
                label="状态">
            </el-table-column>
            <el-table-column
                prop="createTime"
                label="创建时间">
            </el-table-column>
            <el-table-column
                prop="name"
                label="部门名称">
            </el-table-column>
          </el-table>
        </el-main>
      </el-container>
    </el-container>

  </div>



</template>
<script>
export default {
  name: "UsersView",
  data() {
    return {
      menus:[],
      usernames:{},
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      id:'',
      tableData:[],
    }
  }, methods: {
    ruoyiById(data){
      console.log(data.id);
      this.id = data.id;
      console.log("id",this.id);
      this.axios.post("/ruoyi/ruoyiById?id="+this.id).then(res=>{
        this.tableData = res.data.data;
      })
    },
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    list(){
      this.axios.post("/users/usersTree").then(res=>{
        this.menus = res.data.data;
      })
    },
    usersById(data) {
      console.log(data.id);
      this.id = data.id;
      this.axios.post("/users/usersById?id="+this.id).then(res=>{
        this.tableData = res.data.data;
      })
    }
  }, created() {
    this.list();
  }
}
</script>

<style scoped>

</style>